Wijmo DataSoruce
综述:
Wijdatasource 类被用于给 wijwidgets 提供数据。Wijdatasource 需要配合 datareader 和 proxy 使用。Wijdatasource 类、datareader 类和 proxy 类在 jquery.wijmo.wijdatasource.js 文件中实现。
1.下面分别提供显示前端和后端数据的例子:
显示前端数据
可以使用以下代码去读取前端数据:
// array to read var testArray = ["c++", "java", "php", "coldfusion", "javascript", "asp", "ruby", "python", "c", "scala", "groovy", "haskell", "perl"]; // create datareader of array var myReader = new wijarrayreader([{name: 'label'}, {name: 'value'}, {name: 'selected',defaultValue: false}]); // create datasource var datasource = new wijdatasource({ reader: myReader, data: testArray, loaded: function (data){ // get items by data.items var items = data.items; } }); // load datasource, loaded event will be fired after loading. datasource.load(); 复制代码
显示后台数据:
可以使用以下代码去读取后台数据
// define a proxy var proxy = new wijhttpproxy({ url: "http://ws.geonames.org/searchJSON", dataType: "jsonp", data: { featureClass: "P", style: "full", maxRows: 12, name_startsWith: 'ab' }, key: 'geonames' }); // define a reader var myReader = new wijarrayreader([ { name: 'label', mapping: function (item){ return item.name + (item.adminName1 ? ", " + item.adminName1 : "") + ", " + item.countryName } }, {name: 'value',mapping: 'name'}]); // create datasource var datasource = new wijdatasource({ reader: myReader, proxy: proxy, loaded: function (data){ // read items. var items = data.items; } }); // trigger load. datasource.load(); 复制代码
文件,例如 JavaScript 和 CSS 文件。使用Wijdatasource 我们需要添加一下引用:
<script src="jquery-1.7.1.js" type="text/javascript"></script>
3.字段
data:
wijdatasource 处理的数据集
Type:Object
Default:null
例子:
var datasource = new wijdatasource({ reader: myReader, data: testArray, loaded: function (data){ // get items by data.items var items = data.items; } }); 复制代码
proxy :
wijdatasource 的 proxy。wijdatasource 会调用 proxy 字段的 request 方法。在 proxy 字段中,你可以发送 request 到远程服务器来获得 data,这种方式是无刷新的 Ajax 模式。之后我们就可以通过wijdatasource 的reader 来处理返回的纯数据了。
Type:Object
Default:null
示例:
// create datasource var datasource = new wijdatasource({ reader: myReader, proxy: proxy, loaded: function (data){ // read items. var items = data.items; } }); 复制代码
Reader:
Wijdatasource 使用 的reader。Wijdatasource 使用 reader 的read方法从Array中读取原始数据。Field 包含 name,mapping,和默认值 defaultValue 属性 which define the rule of mapping.如果 Wijdatasource 下没有定义 reader,就直接返回原始数据。
Type:Object
Default:null
示例:
var datasource = new wijdatasource({ reader: myReader, data: testArray, loaded: function (data){ // get items by data.items var items = data.items; } }); 复制代码
4.事件:
Loaded:
Wijdatasource 在加载数据结束时触发该事件
参数:
Datasource:触发该事件的 wijdatasource 。
Data:load 方法传递来的数据。
示例:
var datasource = new wijdatasource({loaded: function(e, data) { }}) 复制代码
loading:
Wijdatasource 在加载数据之前触发该事件
Datasource:触发该事件的 wijdatasource 。
Data:load 方法传递来的数据。
5.方法:
Load
Load(data,forceLocalReload)
触发Wijdatasource 的加载数据。
参数:
data:传递给 Loading 和Loaded 事件的数据。
forceLocalReload:正常情况下,数据值加载一遍,如果你需要反复加载数据,需要设置forceLocalReload 为 true。
示例:
var datasource = new wijdatasource({ reader: myReader, proxy: proxy, loaded: function (data){ // read items. var items = data.items; } }); // trigger loading without parameters. datasource.load(); 复制代码
read
触发Wijdatasource 下 DataReader 的数据读取过程,如果存在 DataReader 的话。
示例:
var datasource = new wijdatasource({ reader: myReader, data: testArray }); // trigger reading. datasource.read(); //get the result var mappingData = datasource.items; 复制代码
属性:
Items
原始数据的容器。在数据加载之后可以获得该属性。
Type:Array
Default:[]
示例:
var datasource = new wijdatasource({ reader: myReader, proxy: proxy, loaded: function (data){ // read items. var items = data.items; } }); // trigger loading. datasource.load(); 复制代码